<template>
	<div>
		<!-- 三级分类导航 -->
		<TypeNav/>
		<!-- 列表 -->
		<ListContainer/>
		<!-- 今日推荐 -->
		<Recommend/>
		<!-- 商品排行 -->
		<Rank/>
		<!-- 喜欢 -->
		<Like/>
		<!-- 楼层 -->
		<Floor 
			v-for="floor in floorsList" 
			:floor="floor" 
			:key="floor.id" 
			:cname="'floor-swiper'+floor.id"
		/>
		<!-- 商标 -->
		<Brand/>
	</div>
</template>

<script>
	import {mapState} from 'vuex'
	import ListContainer from './ListContainer'
	import Recommend from './Recommend'
	import Rank from './Rank'
	import Like from './Like'
	import Floor from './Floor'
	import Brand from './Brand'

	export default {
		name:'Home',
		components:{ListContainer,Recommend,Rank,Like,Floor,Brand},
		mounted() {
			//Home组件一挂载，就分发一个获取楼层数据的action
			//为啥Home要拿到楼层数据呢？因为Home决定着有几个“楼”
			this.$store.dispatch('home/getFloorsList')
		},
		computed:{
			...mapState('home',['floorsList'])
		},
	}
</script>

<style lang="less" scoped>
	
</style>